import 'package:flutter/material.dart';
import 'package:learning/components/MyText.dart';
import 'package:learning/generated/LocalModel.dart';
import 'package:learning/generated/l10n.dart';
import 'package:provider/provider.dart';

/// 具备展开收起功能的气泡背景文字面板
/// 气泡：背景色为Color(0xFFF8F8F8)的灰色Container
///      右上角为不规则小三角
///
/// 布局规则：
///     组件的背景是气泡背景
///     包装了[BrnExpandableText]组件，具备了展开收起的能力
///
/// ```dart
///   BrnBubbleText(
///      text: '在文本的右下角有更多或者收起按钮',
///   )
///
///   BrnBubbleText(
///      text: '具备展开收起功能的文字面板，在文本的右下角有更多或者收起按钮',
///      maxLines: 2,
///   )
///
/// ```
///
/// 相关文本组件如下:
///  * [BrnExpandableText], 气泡背景的展开收起文本组件
///  * [BrnInsertInfo], 气泡背景的文本组件
///
class LangCard extends StatefulWidget {
  /// 显示的文本
  final String? lang;

  /// create BrnBubbleText
  const LangCard({Key? key, this.lang = "ug"}) : super(key: key);

  @override
  // ignore: library_private_types_in_public_api
  _LangCardState createState() => _LangCardState();
}

class _LangCardState extends State<LangCard> {
  String? lang;
  BoxDecoration? borderRadius;
  BoxDecoration? borderRadiusSelected;
  TextStyle? textStyle;

  @override
  void initState() {
    lang = "ug";
    borderRadius = const BoxDecoration(
        color: Colors.black38,
        borderRadius: BorderRadius.all(Radius.circular(6)));
    borderRadiusSelected = const BoxDecoration(
        color: Colors.blue, borderRadius: BorderRadius.all(Radius.circular(6)));
    super.initState();
  }

  @override
  void setState(VoidCallback fn) {
    // TODO: implement setState
    super.setState(fn);
    borderRadius = const BoxDecoration(
        color: Colors.black38,
        borderRadius: BorderRadius.all(Radius.circular(6)));
    borderRadiusSelected = const BoxDecoration(
        color: Colors.blue, borderRadius: BorderRadius.all(Radius.circular(6)));
  }

  @override
  Widget build(BuildContext context) {
    textStyle = new TextStyle(color: Colors.white, fontWeight: FontWeight.bold);

    return Directionality(
        textDirection: TextDirection.ltr,
        child: Row(
            //   padding: const EdgeInsets.all(10),
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Expanded(
                flex: 1,
                child: InkWell(
                  onTap: () {
                    setState(() {
                      lang = "ug";
                      changeLang("ug");
                    });
                  },
                  child: Container(
                      padding: EdgeInsets.all(15),
                      margin: EdgeInsets.all(5),
                      decoration:
                          lang == 'ug' ? borderRadiusSelected : borderRadius,
                      child: Center(
                          child: MyText(
                        " ئۇيغۇرچە ",
                        style: textStyle,
                      ))),
                ),
              ),
              Expanded(
                  flex: 1,
                  child: InkWell(
                    onTap: () {
                      setState(() {
                        lang = "zh";
                        changeLang("zh");
                      });
                    },
                    child: Container(
                      padding: EdgeInsets.all(15),
                      margin: EdgeInsets.all(5),
                      decoration:
                          lang == 'zh' ? borderRadiusSelected : borderRadius,
                      child: Center(
                        child: MyText("汉语", style: textStyle),
                      ),
                    ),
                  ))
            ]));
  }

  @override
  void didUpdateWidget(LangCard oldWidget) {
    super.didUpdateWidget(oldWidget);
  }

  void changeLang(String lang) {
    print(lang);
    switch (lang) {
      case "zh":
        Locale _locale = const Locale('zh', 'CN');
        // S.load(_locale);
        Provider.of<LocalModel>(context, listen: false).local(_locale);
        break;
      case "ug":
        Locale _locale = const Locale('zh', 'UG');
        S.load(_locale);

        //  print(_locale);
        Provider.of<LocalModel>(context, listen: false).local(_locale);
        break;
    }
  }
}
